<template>
  <div class="app-container">
    <div>
      <el-form ref="form" :model="queryParams" label-width="80px" inline>
        <el-form-item label="开始时间" prop="beginTime">
          <el-date-picker
            size="small"
            v-model="queryParams.beginTime"
            type="datetime"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="结束时间" prop="endTime">
          <el-date-picker
            size="small"
            v-model="queryParams.endTime"
            type="datetime"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="操作类型" prop="action">
          <el-input v-model="queryParams.action" size="small"/>
        </el-form-item>
        <el-form-item label="用户" prop="actionUserId">
          <el-input v-model="queryParams.actionUserId" size="small"/>
        </el-form-item>
        <el-form-item label="httpMethod" prop="httpMethod">
          <el-input v-model="queryParams.httpMethod" size="small"/>
        </el-form-item>
        <el-form-item label="java方法" prop="javaMethod">
          <el-input v-model="queryParams.javaMethod" size="small"/>
        </el-form-item>
        <el-form-item label="模块" prop="module">
          <el-input v-model="queryParams.module" size="small"/>
        </el-form-item>
        <el-form-item label="请求源ip" prop="requestIp">
          <el-input v-model="queryParams.requestIp" size="small"/>
        </el-form-item>
        <el-form-item label="requestUrl" prop="requestUrl">
          <el-input v-model="queryParams.requestUrl" size="small"/>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="getList" size="small">查询</el-button>
          <el-button type="primary" @click="resetForm('form')" size="small">重置</el-button>
        </el-form-item>
      </el-form>
    </div>

    <div>
      <el-table v-loading="tableLoading"
                :data="tableData"
                height="600"
                border>
        <el-table-column type="selection"></el-table-column>
        <el-table-column label="请求时间" prop="createTime"></el-table-column>
        <el-table-column label="模块" prop="module"></el-table-column>
        <el-table-column label="操作" prop="action"></el-table-column>
        <el-table-column label="用户" prop="actionUserId"></el-table-column>
        <el-table-column label="请求设备" prop="device"></el-table-column>
        <el-table-column label="http请求方法" prop="httpMethod"></el-table-column>
        <el-table-column label="源ip" prop="requestIp"></el-table-column>
        <el-table-column label="请求url" prop="requestUrl"></el-table-column>
        <el-table-column label="源请求操作系统" prop="sysName"></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button size="small" type="text" @click="()=>{viewVisible=true;viewData = scope.row}">查看</el-button>
          </template>
        </el-table-column>
      </el-table>
      <Pagination
        background
        :page-sizes="pageWrapper.pageSizes"
        :total="pageWrapper.total"
        :limit.sync="pageWrapper.size"
        :page.sync="pageWrapper.current"
        auto-scroll
        @pagination="getList"
        layout="sizes,prev, pager, next"
      />
    </div>


    <!--view-->
    <el-dialog :visible.sync="viewVisible" footer="" >
      <el-descriptions border title="查看">
        <el-descriptions-item label="ID">{{ viewData.id }}</el-descriptions-item>

        <el-descriptions-item label="操作">{{ viewData.action }}</el-descriptions-item>
        <el-descriptions-item label="操作的用户">{{ viewData.actionUserId }}</el-descriptions-item>
        <el-descriptions-item label="请求设备">{{ viewData.device }}</el-descriptions-item>
        <el-descriptions-item label="http请求方法">{{ viewData.httpMethod }}</el-descriptions-item>
        <el-descriptions-item label="请求的java方法">{{ viewData.javaMethod }}</el-descriptions-item>
        <el-descriptions-item label="模块">{{ viewData.module }}</el-descriptions-item>
        <el-descriptions-item label="请求参数">{{ viewData.requestParams }}</el-descriptions-item>
        <el-descriptions-item label="请求源ip">{{ viewData.requestIp }}</el-descriptions-item>
        <el-descriptions-item label="当前请求的url">{{ viewData.requestUrl }}</el-descriptions-item>
        <el-descriptions-item label="响应数据 仅在json下有效">{{ viewData.responseBody }}</el-descriptions-item>
        <el-descriptions-item label="源请求的操作系统">{{ viewData.sysName }}</el-descriptions-item>
        <el-descriptions-item label="创建时间">{{ viewData.createTime }}</el-descriptions-item>
        <el-descriptions-item label="修改时间">{{ viewData.updateTime }}</el-descriptions-item>
      </el-descriptions>
    </el-dialog>

  </div>
</template>

<script>
import Pagination from '@/components/Pagination'
import {pageData, create, update, removeById} from "@/api/system/tActionLog";
import {pageMixin, formMixin} from "@/mixins/mixins";


export default {
  name: "TActionLog",
  mixins: [pageMixin, formMixin],
  components: {Pagination},
  data() {
    return {
      tableLoading: false,
      tableData: [],
      queryParams: {
        actionType: '',
        actionUserId: '',
        httpMethod: '',
        javaMethod: '',
        module: '',
        requestIp: '',
        requestUrl: '',
        beginTime:'',
        endTime:'',
      },

      viewVisible: false,
      viewData: {
        id: '',
        createTime: '',
        updateTime: '',
        action: '',
        actionUserId: '',
        device: '',
        httpMethod: '',
        javaMethod: '',
        module: '',
        requestParams: '',
        requestIp: '',
        requestUrl: '',
        responseBody: '',
        sysName: '',
      },

    }
  },
  mounted() {
    this.getList();
  },
  methods: {
    getList() {
      this.tableLoading = true;
      pageData({current: this.pageWrapper.current, size: this.pageWrapper.size, ...this.queryParams}).then(res => {
        this.setPageWrapper(res.data);
        this.tableData = res.data.records;
        this.tableLoading = false;
      })
    },




  }
}
</script>

<style scoped>

</style>
